<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="../../../bootstrap-3.0.0/dist/css/bootstrap.css">
    <script src="../../../jquery.js"></script>
    <script src="../../../bootstrap-3.0.0/dist/js/bootstrap.js"></script>
    <title>starter</title>

    <style>
        @media (min-width: 768px) {
            .container {
                max-width: 730px;
            }
        }

        .header {
            border-bottom: 1px solid #E5E5E5;
            margin-bottom: 20px;
        }

        h3 {
            padding-bottom: 19px;
        }

        .jumbotron {
            text-align: center;
        }

        .jumbotron .btn {
            font-size: 21px;
            padding: 14px 24px;
        }

        .marketing {
            margin: 0;
        }

    </style>
</head>
<body>

<div class="container">
    <div class="header">
        <ul class="nav nav-pills pull-right">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="#">about</a></li>
            <li><a href="#">contact</a></li>
        </ul>
        <h3 class="text-muted">Project name</h3>
    </div>

    <div class="jumbotron">
        <h1>Jumbotron heading</h1>

        <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Fusce dapibus, tellus ac cursus commodo, tortor
            mauris condimentum nibh, ut fermentum massa justo sit amet risus.
        </p>

        <p><a class="btn btn-success btn-lg">Sign up today</a></p>
    </div>

    <div class="row marketing">
        <div class="col-lg-6">
            <h4>Subheading</h4>

            <p>Donec id elit non mi porta gravida at eget metus. Maecenas faucibus mollis interdum.</p>
        </div>
        <div class="col-lg-6">
            <h4>Subheading</h4>

            <p>Donec id elit non mi porta gravida at eget metus. Maecenas faucibus mollis interdum.</p>
        </div>
    </div>

    <div class="row marketing">
        <div class="col-lg-6">
            <h4>Subheading</h4>

            <p>Donec id elit non mi porta gravida at eget metus. Maecenas faucibus mollis interdum.</p>
        </div>
        <div class="col-lg-6">
            <h4>Subheading</h4>

            <p>Donec id elit non mi porta gravida at eget metus. Maecenas faucibus mollis interdum.</p>
        </div>
    </div>

    <div class="row marketing">
        <div class="col-lg-6">
            <h4>Subheading</h4>

            <p>Donec id elit non mi porta gravida at eget metus. Maecenas faucibus mollis interdum.</p>
        </div>
        <div class="col-lg-6">
            <h4>Subheading</h4>

            <p>Donec id elit non mi porta gravida at eget metus. Maecenas faucibus mollis interdum.</p>
        </div>
    </div>

    <hr>
</div>

<div class="container">
        <footer class="footer">&copy;Company 2013</footer>
</div>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>

</body>
</html>